<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="../debug/debug.js"></script>
<script>
	var debug;
	
	//브라우저 상에서 엘리먼트의  x좌표를 얻는다.
	function pageX(elem){
		var p=0;
		while(elem.offsetParent){
			p+=elem.offsetLeft;
			elem = elem.offsetParent;
		}		
		return p;
	}	
	//브라우저 상에서 엘리먼트의 y좌표를 얻는다.
	function pageY(elem){
		var p=0;
		while(elem.offsetParent){
			p+=elem.offsetTop;
			elem = elem.offsetParent;
		}
		return p;
	}
	
	function pageHeight(){
		return document.body.scrollHeight;
	}
	function pageWidth(){
		return document.body.scrollWidth;
	}
	
	//스크롤바의 위치 알아내기
	function scrollX(){
		var de = document.documentElement;  // 인터넷익스플로러 6이 strict mode로 돌아갈 때를 대비한 단추코드
		return self.pageXOffset||(de&&de.scrollLeft)||document.body.scrollLeft;
	}
	
	function scrollY(){
		var de = document.documentElement;  // 인터넷익스플로러 6이 strict mode로 돌아갈 때를 대비한 단추코드
		return self.pageYOffset||(de&&de.scrollTop)||document.body.scrollTop;
	}
	
	window.onload= function(e){
		var debug = new DebugConsole();
		
		debug.displayMsg("height:"+pageHeight()+",width:"+pageWidth());
		
		//스크롤바를 원하는 위치로  이동하기
		window.scrollTo(0,pageY(document.getElementById("lastp")));
	}
	window.onscroll = function(e){
		var debug = new DebugConsole();
		debug.displayMsg("x:"+scrollX()+",y:"+scrollY());
	}
</script>
</head>
<body>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p><p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p>p</p>
<p id="lastp">p</p>

</body>
</html>